<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=0.5,minimum=1,maximum=1,user-scalable=no">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>美团外卖吃喝</title>
    <link rel="stylesheet" href="css/style.css" media="screen" title="no title">
    <link rel="stylesheet" type="text/css" href="css/Reset.css">
    <link rel="stylesheet" href="font/iconfont.css" media="screen" title="no title">
    <style media="screen">
    ::-webkit-scrollbar {
        width: 0;
        height: 0;
    }
    </style>
    <script>
    var html = document.getElementsByTagName('html')[0];
    html.style.fontSize = html.clientWidth / 10.8 + "px";
    addEventListener("resize", function() {
        html.style.fontSize = html.clientWidth / 10.8 + "px";
    }, false)
    </script>
</head>

<body>
    <div class="title">
        <ul>
            <li class="iconfont close">&#xe648;</li>
            <li class="option" id="tHead">美食外卖玩乐</li>
            <li class="iconfont more">&#xe601;</li>
        </ul>
    </div>
    <div class="wrapper" id="page1" >
        <div class="head_top">
            <header class="header">
                <div class="iconfont beiji">北京</div>
                <div class="search">
                    <form action="">
                        <input type="text" name="name" value="" placeholder="输入商户名、地点">
                    </form>
                </div>
                <div class="iconfont my"></div>
            </header>
        </div>
        <div class="container">
            <div class="nav">
                <ul>
                    <li>
                        <a href="#"><img src="img/1.png" alt="" />
                            <span>美食</span></a>
                    </li>
                    <li>
                        <a href="#"><img src="img/2.png" alt="" />
                            <span>电影</span></a>
                    </li>
                    <li>
                        <a href="#"><img src="img/3.png" alt="" />
                            <span>酒店</span></a>
                    </li>
                    <li>
                        <a href="#"><img src="img/4.png" alt="" />
                            <span>休闲娱乐</span></a>
                    </li>
                    <li>
                        <a href="#"><img src="img/5.png" alt="" />
                            <span>外卖</span></a>
                    </li>
                </ul>
                <ul>
                    <li>
                        <a href="#"><img src="img/6.png" alt="" />
                            <span>KTV</span></a>
                    </li>
                    <li>
                        <a href="#"><img src="img/7.png" alt="" />
                            <span>周边游</span></a>
                    </li>
                    <li>
                        <a href="#"><img src="img/8.png" alt="" />
                            <span>丽人</span></a>
                    </li>
                    <li>
                        <a href="#"><img src="img/9.png" alt="" />
                            <span>小吃快餐</span></a>
                    </li>
                    <li>
                        <a href="#"><img src="img/10.png" alt="" />
                            <span>机票/火车票</span></a>
                    </li>
                </ul>
            </div>
            <div class="activity">
                <div>
                    <h1 class="mtitle blue">电影超值惠</h1>
                    <h2 class="subhead">19.9元起</h2>
                </div>
                <div>
                    <h1 class="mtitle orange">天天有满减</h1>
                    <h2 class="subhead">低至2折起</h2>
                </div>
                <div>
                    <h1 class="mtitle pink">外卖招牌菜</h1>
                    <h2 class="subhead">强力推荐</h2>
                </div>
            </div>
            <div class="favorable">
                <div class="headline">
                    <i>超值优惠</i>
                    <span><em>更多优惠</em> <b>&gt;</b></span>
                </div>
                <div class="cont">
                    <ul>
                        <li><img src="img/youh_1.jpg"></li>
                        <li>护国寺小吃店</li>
                        <li><span class="orange ">￥1</span><i>￥5</i></li>
                    </ul>
                    <ul>
                        <li><img src="img/youh_2.jpg"></li>
                        <li>咖啡陪你</li>
                        <li><span class="orange">￥1</span><i>￥10</i></li>
                    </ul>
                    <ul>
                        <li><img src="img/youh_3.jpg"></li>
                        <li>SIX酒吧惊爆体验中</li>
                        <li><span class="orange">￥1</span><i>￥15</i></li>
                    </ul>
                </div>
            </div>
            <div class="like">
                <div class="headline">
                    <i>猜你喜欢</i>
                </div>
                <div class="cont">
                    <div class="floor">
                        <div class="con_l">
                            <img src="img/act_1.jpg">
                        </div>
                        <div class="con_r">
                            <p><b>芭斯罗宾</b><span>4km</span></p>
                            <h2>[13店通用]霸王单球冰淇淋球1份</h2>
                            <h3><i class="orange">￥22</i><b>￥31</b><span>已售1637</span></h3>
                        </div>
                    </div>
                    <div class="floor">
                        <div class="con_l">
                            <img src="img/act_2.jpg">
                        </div>
                        <div class="con_r">
                            <p><b>芭斯罗宾</b><span>4km</span></p>
                            <h2>[13店通用]霸王单球冰淇淋球1份</h2>
                            <h3><i class="orange">￥22</i><b>￥31</b><span>已售1637</span></h3>
                        </div>
                    </div>
                    <div class="floor" id="details">
                        <div class="con_l">
                            <img src="img/act_3.jpg">
                        </div>
                        <div class="con_r">
                            <p><b>麦当劳</b><span>4km</span></p>
                            <h2>[13店通用]霸王单球冰淇淋球1份</h2>
                            <h3><i class="orange">￥18</i><b>￥24</b><span>已售1637</span></h3>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <footer class="footer">
            <div class="active"><i class="iconfont icon">&#xe604;</i>首页</div>
            <div><i class="iconfont icon">&#xe62c;</i>外卖</div>
        </footer>
    </div>
    <div class="wrapper" id="page2" style="display: none;">
        <div class="tgdetails">
            <div>&lt;</div>
            <div>返回</div>
            <div>团购详情</div>
        </div>
        <div class="imgbox">
            <img src="img/mdlao.jpg">
        </div>
        <div class="price">
            <h1><i class="orange">￥18</i><b>￥24</b> <span>立即购买</span></h1>
            <h2><span class="iconfont">随时可退</span><span class="iconfont">过期自动退</span></h2>
        </div>
        <div class="shangh">
            <div class="sh">
                <p>适用商户(268)<span>&gt;</span></p>
            </div>
            <div class="name">
                <div class="left">
                    <h1>麦当劳(沙河得来速店)</h1>
                    <div>
                        <ul>
                            <li class="iconfont orange">&#xe64e;</li>
                            <li class="iconfont orange">&#xe64e;</li>
                            <li class="iconfont orange">&#xe64e;</li>
                            <li class="iconfont">&#xe64e;</li>
                            <li class="iconfont">&#xe64e;</li>
                        </ul>
                        <span>2.1km</span>
                    </div>
                </div>
                <div class="right"><i class="iconfont orange">&#xe603;</i></div>
            </div>
            <div class="address" id="address">
                <p class="iconfont">沙河镇巩华城大街67号</p>
            </div>
        </div>
        <div class="tgde">
            <ul>
                <li class="col1">团购详情<i class="iconfont">&#xe62d;</i></li>
                <li class="col2">单个玩具套餐</li>
                <li class="col1"><span>Line玩具(1款任选)</span><span>1份&nbsp;&nbsp;&nbsp;20元</span></li>
                <li class="col1"><span>原味圆筒冰激凌</span><span>1份&nbsp;&nbsp;&nbsp;4&nbsp;元</span></li>
                <li class="col2"><span>24元</span><span>最高价值</span></li>
                <li class="orange"><b>18元</b><span>团购价</span></li>
                <li class="col2">免费提供餐巾纸</li>
                <li class="col1">更多图文介绍<i class="col2">(建议WIFI环境下打开，土豪请随意)</i></li>
            </ul>
        </div>
        <div class="buy">
            <ul>
                <li>购买须知<i class="iconfont">&#xe62d;</i></li>
                <li>大家都可以吃</li>
                <li>吃过了也可以吃</li>
                <li>没吃过当然要吃</li>
            </ul>
        </div>
    </div>
    <div class="wrapper" id="page3" style="display: none;">
        <div class="iconfont" id="back">&#xe70d;</div>
    </div>
</body>
<script type="text/javascript" src="js/zepto.js"></script>
<script type="text/javascript" src="js/event.js"></script>
<script type="text/javascript" src="js/touch.js"></script>
<script type="text/javascript" src="js/main.js"></script>
<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=rHiNykwMmpun0ch0VTirvVMq2VRigzja"></script>

</html>
